import type { ElementType, LegacyRef, ReactNode } from 'react';
import type { ColorEnum, SizeEnum, WidthEnum } from '../common';

export interface ButtonOptions {
  /**
   * 标签或组件名称
   * @default button
   */
  as?: ElementType;
  /**
   * 是否激活状态
   * @default false
   */
  active?: boolean;
  /**
   * 是否禁用状态
   * @default false
   */
  disabled?: boolean;
  /**
   * 是否为基础样式
   * @default false
   */
  basic?: boolean;
  /**
   * 是否无边框
   * @default false
   */
  tertiary?: boolean;
  /**
   * 是否深色背景显示
   * @default false
   */
  inverted?: boolean;
  /**
   * 组件风格，依次为默认、主要、次要、积极、消极
   * @default undefined
   */
  color?: 'primary' | 'secondary' | 'positive' | 'negative' | ColorEnum;
  /**
   * 是否显示为加载状态
   * @default false
   */
  loading?: boolean | 'double' | 'elastic';
  /**
   * 按钮尺寸大小
   * @default medium
   */
  size?: SizeEnum;
  /**
   * 图标按钮
   * @default false
   */
  icon?: boolean;
  /**
   * 按钮内容，同 children
   */
  content?: ReactNode;
  /**
   * 流体
   */
  fluid?: boolean;
  /**
   * 按钮类型
   */
  type?: 'submit' | 'reset' | 'button';
  /**
   * 转发 ref
   */
  forwardedRef?: LegacyRef<HTMLElement>;
}

export interface ButtonGroupOptions {
  /**
   * 图标按钮组
   * @default false
   */
  icon?: boolean;
  /**
   * 流体
   */
  fluid?: boolean;
  /**
   * 等宽
   */
  equal?: WidthEnum;
  /**
   * 转发 ref
   */
  forwardedRef?: LegacyRef<HTMLElement>;
}
